<template>
    <!-- <returnedMoney v-if="isReturnedMoney"></returnedMoney> -->
    <div  class="m-window">
        <div class="makeLoans-col">
            <el-row :gutter="10" style="margin:8px auto;" >
                <el-col :span="2" >
                    <el-button type="primary" @click="backMyToList">返回</el-button>
                </el-col>
            </el-row>
            <el-row :gutter="10" style="margin:8px auto;" class="footer-btns-col">
                <el-col :span="2" v-show="pageSourceCode != 'myProcessed'">
                    <el-button type="primary" @click="sendBack">退回</el-button>
                </el-col>
                <el-col :span="2" v-show="pageSourceCode != 'myProcessed'">
                    <el-button type="primary" @click="handlePass">通过</el-button>
                </el-col>
                
            </el-row>
            <el-row>
                <el-col>流程编号：{{processNumber}}</el-col>
            </el-row>
             <el-row :gutter="10">
                <el-col :span="7">请下载<a  class="hit" @click="getFK">{{processNumber}}放款审批表.pdf</a>,然后签字！</el-col>
                <el-col :span="2" :offset="13"><a class="hit"  @click="getFK">下载文件</a></el-col>
            </el-row>
            <el-row class="makeLoans-table">
                <el-col class="table-col">
                    <div>
                        <div class="m-file-title">
                            <h2>深圳前海联塑商业保理有限公司</h2>
                            <p>放款审批表（SRM系统客户)</p>
                        </div>
                        <div>
                            <table class="m-file-table" width="60%" v-if="finType==1">
                                <tr>
                                    <td>项目名称</td>
                                    <td colspan="4">{{contract.projectName}}</td>
                                </tr>
                                <tr>
                                    <td>保理服务合同号</td>
                                    <td colspan="4">{{contract.contractNoFirst}}</td>
                                </tr>
                                <tr>
                                    <td>保理融资期限</td>
                                     <td colspan="2">{{contract.payDate}}  至  {{contract.payBackDate}}</td>
                                    <td>保理总费率</td>
                                    <td>{{contract.totalRate}} %/年</td>   
                                </tr>
                                <tr>
                                    <td>保理利率(不含税)</td>
                                    <td colspan="2">{{contract.rate}} %/年</td>
                                    <td>保理服务费率(不含税)</td>
                                    <td>{{contract.servicePayRate}} %/年</td>   
                                </tr>
                                <tr >
                                    <td rowspan="2">授信情况</td>
                                    <td>总授信额度</td>
                                    <td>¥ </td> 
                                    <td>已使用额度</td>
                                    <td>¥ </td> 
                                </tr>
                                <tr>
                                    <td>剩余额度（不含本次）</td>
                                    <td>¥ </td> 
                                    <td>本次使用额度</td>
                                    <td>¥ {{contract.currentMoney}}</td> 
                                </tr>
                                <tr >
                                    <td rowspan="3">收款人信息</td>
                                    <td style="text-align:left">账户名</td>
                                    <td  colspan="3">{{contract.accountName}}</td>  
                                </tr>
                                <tr >
                                    <td style="text-align:left">账  号</td>
                                    <td  colspan="4">{{contract.account}}</td>  
                                </tr>
                                <tr >
                                   <td style="text-align:left">开户行</td>
                                    <td  colspan="4">{{contract.accountBank}}</td>   
                                </tr>
                                <tr >
                                    <td rowspan="3">事业部 </td>
                                    <td colspan="2"></td>
                                    <td  colspan="2"></td>  
                                </tr>
                                <tr >
                                    <td colspan="2" style="text-align:left">项目经理签字：</td>
                                    <td colspan="2" style="text-align:left">部门总监签字：</td>
                                </tr>
                                <tr >
                                    <td colspan="2" style="text-align:left">日期：</td>
                                    <td colspan="2" style="text-align:left">日期：</td>
                                </tr>
                                <tr >
                                    <td rowspan="3">风控部 </td>
                                    <td colspan="2"></td>
                                    <td  colspan="2"></td>  
                                </tr>
                                <tr >
                                    <td colspan="2" style="text-align:left">经办人签字：</td>
                                    <td colspan="2" style="text-align:left">部门总监签字：</td>
                                </tr>
                                <tr >
                                    <td colspan="2" style="text-align:left">日期：</td>
                                    <td colspan="2" style="text-align:left">日期：</td>
                                </tr>
                                <tr >
                                    <td  rowspan="16">合规部</td>
                                    <td  >内容</td>
                                    <td colspan="3" >经办情况</td>
                                </tr>
                                <tr >
                                    <td>应收账款基础资料收集</td>
                                    <td colspan="3" ></td>
                                </tr>
                                <tr >
                                    <td>中登网登记</td>
                                    <td colspan="3" ></td>
                                </tr>
                                <tr >
                                    <td>印章核实</td>
                                    <td colspan="3" ></td>
                                </tr>
                                <tr >
                                    <td>合同签署</td>
                                    <td colspan="3" ></td>
                                </tr>
                                <tr >
                                    <td>评审会要求</td>
                                    <td colspan="3" ></td>
                                </tr>
                                <tr >
                                    <td>其他补充</td>
                                    <td colspan="3" ></td>
                                </tr>
                                <tr >
                                    <td colspan="2" style="text-align:right;border-right-color:#ffffff;"> 经办人签字：</td>
                                    <td colspan="2" > 时间：</td>
                                </tr>
                                <tr >
                                    <td>内容</td>
                                    <td colspan="3" ></td>
                                </tr>
                                <tr >
                                    <td>应收账款基础资料收集</td>
                                    <td colspan="3" ></td>
                                </tr>
                                <tr >
                                    <td>中登网登记</td>
                                    <td colspan="3" ></td>
                                </tr>
                                <tr >
                                    <td>印章核实</td>
                                    <td colspan="3" ></td>
                                </tr>
                                <tr >
                                    <td>合同签署</td>
                                    <td colspan="3" ></td>
                                </tr>
                                <tr >
                                    <td>评审会要求</td>
                                    <td colspan="3" ></td>
                                </tr>
                                <tr >
                                    <td>其他补充</td>
                                    <td colspan="3" ></td>
                                </tr>
                                <tr >
                                     <td colspan="2" style="text-align:right;border-right-color:#ffffff;"> 复核人签字：</td>
                                    <td colspan="2" > 时间：</td>
                                </tr>
                                <tr >
                                    <td rowspan="6" >资金部</td>
                                    <td >利息</td>
                                    <td  style="text-align:left;border-right-color:#ffffff;">金额：</td>
                                    <td colspan="2">（含税金      ）  </td>
                                </tr>
                                <tr >
                                    <td >服务费</td>
                                    <td  style="text-align:left;border-right-color:#ffffff;">金额：</td>
                                    <td colspan="2">（含税金      ）  </td>
                                </tr>
                                <tr >
                                    <td>保证金</td>
                                    <td colspan="3" style="text-align:left;">金额：</td>
                                </tr>
                                <tr >
                                    <td>票据</td>
                                    <td colspan="3" style="text-align:left;"></td>
                                </tr>
                                <tr >
                                    <td>其他补充</td>
                                    <td colspan="3" ></td>
                                </tr>
                                <tr >
                                    <td colspan="2" style="text-align:right;border-right-color:#ffffff;"> 经办人签字：</td>
                                    <td colspan="2" > 时间：</td>
                                </tr>
                                <tr >
                                    <td  > 副总经理意见</td>
                                    <td colspan="2" style="text-align:right;border-right-color:#ffffff;"> 签字：</td>
                                    <td colspan="2" > 时间：</td>
                                </tr>
                                <tr >
                                    <td  > 总经理意见</td>
                                    <td colspan="2" style="text-align:right;border-right-color:#ffffff;"> 签字：</td>
                                    <td colspan="2" > 时间：</td>
                                </tr>
                                <tr >
                                    <td  rowspan="2" > 董事长</td>
                                    <td colspan="4" style="border-bottom-color:#ffffff;"></td>
                                </tr>
                                 <tr >
                                    <td colspan="2" style="text-align:left;border-right-color:#ffffff;">（累计授信额度500万以上项目需董事长审批）</td>
                                    <td  style="text-align:right;border-right-color:#ffffff;"> 签字：</td>
                                    <td  > 时间：</td>
                                </tr>




                            </table>
                            <table class="m-file-table" width="60%" v-if="finType==0">
                                <tr>
                                    <td>项目名称</td>
                                    <td colspan="4">{{contract.projectName}}</td>
                                </tr>
                                <tr>
                                    <td>保理服务合同号</td>
                                    <td colspan="4">{{contract.contractNoFirst}}</td>
                                </tr>
                                <tr>
                                    <td>保理融资期限</td>
                                    <td colspan="2">{{contract.payDate}}  至  {{contract.payBackDate}}</td>
                                    <td>保理服务费率(含税)</td>
                                    <td>{{contract.servicePayRate}} %/天</td>   
                                </tr>
                                <tr>
                                    <td>融资天数</td>
                                    <td colspan="4">{{contract.days}}</td>
                                </tr>
                                <tr>
                                    <td>保理融资本金金额</td>
                                    <td colspan="2">小写：¥{{contract.actualAmount}}</td>
                                    <td colspan="2">人民币：{{contract.actualAmountCH}}</td> 
                                </tr>
                                <tr>
                                    <td>保理服务费用(预扣、含税)</td>
                                    <td colspan="2">小写：¥{{contract.servicePayAmount}}</td>
                                    <td colspan="2">人民币：{{contract.servicePayAmountCH}}</td> 
                                </tr>
                                <tr>
                                    <td>实际发放金额</td>
                                    <td colspan="2">小写：¥{{contract.realPayAmount}}</td>
                                    <td colspan="2">人民币：{{contract.realPayAmountCH}}</td> 
                                </tr>
                                <tr >
                                    <td rowspan="3">收款人信息</td>
                                    <td style="text-align:left">账户名</td>
                                    <td  colspan="3">{{contract.accountName}}</td>  
                                </tr>
                                <tr >
                                    <td style="text-align:left">账  号</td>
                                    <td  colspan="4">{{contract.account}}</td>  
                                </tr>
                                <tr >
                                   <td style="text-align:left">开户行</td>
                                    <td  colspan="4">{{contract.accountBank}}</td>   
                                </tr>
                                <tr >
                                    <td rowspan="3">事业部 </td>
                                    <td colspan="4" rowspan="2" style="text-align:left;">经办人签字：</td>  
                                </tr>
                                <tr  >
                                    <!-- <td colspan="4"  style="text-align:left"></td> -->
                                </tr>
                                <tr >
                                    <td colspan="4" style="text-align:left;">日期：</td>
                                </tr>
                                <tr >
                                    <td rowspan="3">风控部 </td>
                                    <td colspan="4" rowspan="2" style="text-align:left;">经办人签字：</td>  
                                </tr>
                                <tr >
                                </tr>
                                <tr >
                                     <td colspan="4" style="text-align:left;">日期：</td>
                                </tr>
                                <tr >
                                    <td  rowspan="8">合规部</td>
                                    <td  >内容</td>
                                    <td colspan="3" >经办情况</td>
                                </tr>
                                <tr >
                                    <td>应收账款基础资料收集</td>
                                    <td colspan="3" ></td>
                                </tr>
                                <tr >
                                    <td>合同签署</td>
                                    <td colspan="3" ></td>
                                </tr>
                                <tr >
                                    <td>电子签章核实</td>
                                    <td colspan="3" ></td>
                                </tr>
                                <tr >
                                    <td>中登网登记</td>
                                    <td colspan="3" ></td>
                                </tr>
                                <tr >
                                    <td>应收账款转让通知发送</td>
                                    <td colspan="3" ></td>
                                </tr>
                                <tr >
                                    <td>其他补充</td>
                                    <td colspan="3" ></td>
                                </tr>
                                <tr >
                                    <td colspan="2" style="text-align:right;border-right-color:#ffffff;"> 经办人签字：</td>
                                    <td colspan="2" > 时间：</td>
                                </tr>
                                <tr >
                                    <td  > 副总经理意见</td>
                                    <td colspan="2" style="text-align:right;border-right-color:#ffffff;"> 签字：</td>
                                    <td colspan="2" > 时间：</td>
                                </tr>
                                <tr >
                                    <td  > 总经理意见</td>
                                    <td colspan="2" style="text-align:right;border-right-color:#ffffff;"> 签字：</td>
                                    <td colspan="2" > 时间：</td>
                                </tr>
                                <tr >
                                    <td  rowspan="2" > 董事长</td>
                                    <td colspan="4" style="border-bottom-color:#ffffff;"></td>
                                </tr>
                                 <tr >
                                    <td colspan="2" style="text-align:left;border-right-color:#ffffff;">（累计授信额度500万以上项目需董事长审批）</td>
                                    <td  style="text-align:right;border-right-color:#ffffff;"> 签字：</td>
                                    <td  > 时间：</td>
                                </tr>
                            </table>
                        </div>
                    </div>
                </el-col>
                <el-form :model="makeLoansForm" ref="makeLoansForm">
                    <el-form-item class="signature" prop="signature" style="display:none;">
                        <el-checkbox-group v-model="makeLoansForm.signature">
                            <el-checkbox label="已签字" name="signature" :disabled="pageSourceCode == 'myProcessed'"/>
                        </el-checkbox-group>
                    </el-form-item>
                    <el-form-item prop="backReason"  style="margin-top:-8px;">
                        <label>退回原因 &nbsp;<i class="el-icon-warning"></i></label>
                        <el-input type="textarea" v-model="makeLoansForm.backReason" placeholder="退回原因" :disabled="pageSourceCode == 'myProcessed'" />
                    </el-form-item>
                </el-form>
            </el-row>
            
        </div>
    </div>
</template>
<style lang="less" scoped>
.footer-btns-col,.header-btns-col{
    position:fixed;
    height: 60px;
    width: 100%;
    bottom: 0;
    z-index: 10;
    margin-left: -11px !important;
    box-sizing:border-box;
    display: flex;
    justify-content: center;
    align-items:center;
    background: #fff;
    padding: 10px 0;
    border-top: 1px solid #eee;
    /deep/ .el-button{
      margin-left: -84px;
    }
  }
  .header-btns-col{
    top: 0;
    justify-content: flex-start;
    border-top: none;
    border-bottom: 1px solid #eee;
    margin-top: 100px;
    /deep/ .el-button{
      margin-left: 8px;
    }
  }
   .makeLoans-col a.hit{
        color: #409EFF;
    }
    .makeLoans-col .content{
        flex-direction: column;
    }
    .makeLoans-table{
        position: absolute;
        top:130px;
        left: 0;
        right: 0;
        bottom: 0;
        padding-bottom: 75px;
        overflow-x: hidden;
        overflow-y: auto;
    }
   .makeLoans-col .table-col{
        height:auto;
        
        border:1px solid #eee;
    }
    .makeLoans-col .signature {
        margin-bottom: 0;
    }
   .makeLoans-col .signature .el-form-item__content{
        line-height: 0 !important;
    }
   .makeLoans-col .signature .el-form-item__error{
        margin-top: -10px;
        padding-top: 0;
    }
    .m-file-table{
        background: #f9fafa;
        border: 1px solid #3d3d3d;
        padding: 10px;
        text-align: center;
        margin: 0 auto;
    }
    .m-file-table>tr{
        height: 40px;
        border: 1px solid #3d3d3d;
    }
    .m-file-table>tr>td{
         border: 1px solid #3d3d3d;
         width: 20%;
         padding: 5px;
         
    }
    .m-file-title{
        text-align: center;
        margin-top: 30px;
        margin-bottom: 20px;
    }
    .m-file-title>h2{
        font-size: 24px;
        font-weight: bold;
        margin-bottom: 10px;
    }
    .m-file-title>p{
        font-size: 18px;
    }
</style>

<script>
// import ReturnedMoney from './returnedMoney.vue'
import { showAlert } from "lesso-common/public/utils"
import { download } from '@/util/fileDownload.js'
import { mapState,mapActions } from 'vuex'
import { formatRate } from "@/util/format.js";
export default {
    props:['pageSourceCode'],
    data(){
        return {
            makeLoansForm:{
                signature:true,
                backReason:''
            },
            processNumber:'',
            linkName:'act_fin_loan', //流程环节名称
            examinePass:0,   //处理结果  2是通过，3是退回,0默认 
            fileUrl:"",  //默认文件路径
            contract:{},  //文件内容
            finType:''//类型
        }
    },
    computed: {
        ...mapState(['supplyChainFinance'])
    },
    beforeMount(){
        this.getMakeData();
    },
    create(){
        
    },
    methods:{
        ...mapActions([
            'changeTOdo',
            'changeMyProcessedCTCode'
        ]),
        //请求放款页面数据
        getMakeData(){
            //this.supplyChainFinance.role.ID
            //e0f0c5f4-8b5b-4c10-8e35-54c41d8d8541
            var params={applyId:this.supplyChainFinance.role.ID}
            // var params={applyId:"e0f0c5f4-8b5b-4c10-8e35-54c41d8d8541"}
            var _this=this;
            this.$http.getLoanInfo(params).then(res => {
                console.log(res)
                if(res.data.code==200){
                    _this.processNumber =res.data.rows.processNumber;
                    _this.finType=res.data.rows.finType
                    _this.contract =res.data.rows;
                    _this.contract.servicePayRate = parseFloat(formatRate(_this.contract.servicePayRate)) 
                    _this.contract.payDate = _this.contract.payDate.substring(0,10)
                    _this.contract.payBackDate = _this.contract.payBackDate.substring(0,10)
                }else{
                    showAlert({
                        msg: `${res.data.info}`,
                        type: 0
                    })
                }
            })
            .catch(err => {
                this.$alert("查询失败，请检查网络！", {
                    confirmButtonText: "确定",
                    customClass: "alertFailure"
                });
            })
        },
        //请求pdf文件
        getFK(){
            //this.supplyChainFinance.role.ID
            var params={applyId:this.supplyChainFinance.role.ID}
            var _this=this;
            if(this.finType==1){
                this.$http.getFKWordRZL(params).then(res => {
                    if(res.data.code==200){
                        var url = res.data.rows[0].fileName;
                        var filename= res.data.rows[0].orgName
                        _this.fileDownload(filename,url)
                    }else{
                        showAlert({
                            msg: `${res.data.info}`,
                            type: 0
                        })
                    }
                })
                .catch(err => {
                    this.$alert("下载失败，请检查网络！", {
                        confirmButtonText: "确定",
                        customClass: "alertFailure"
                    });
                })
            }else{
               this.$http.getFKWordRZS(params).then(res => {
                    if(res.data.code==200){
                        var url = res.data.rows[0].fileName;
                        var filename= res.data.rows[0].orgName
                        _this.fileDownload(filename,url)
                    }else{
                        showAlert({
                            msg: `${res.data.info}`,
                            type: 0
                        })
                    }
                })
                .catch(err => {
                    this.$alert("下载失败，请检查网络！", {
                        confirmButtonText: "确定",
                        customClass: "alertFailure"
                    });
                }) 
            }
        },
        fileDownload(filename,url){
            let _this=this;
           this.$http.getFullFilePath({
            'url': url
            }).then(({ data }) => {
                if (data.code == 200) {
                     download(filename,data.rows[0].fileName)
                } else {
                    showAlert({
                        msg: `操作失败：${data.info}`,
                        type: 0
                    })
                }
            })
            .catch((error) => {
                showAlert({
                    msg: `查询失败，请检查网络！`,
                    type: 0
                })
            })
       },
        //通过或者退回请求
        commonUpdate(){
            let that = this
            let params = {
                name:that.linkName,
                applyId:that.supplyChainFinance.role.ID,
                result:this.examinePass,
                note:this.makeLoansForm.backReason
            }
            this.$http.commonUpdate(params).then(res=>{
                if(res.data.code == 200){
                    showAlert({
                        msg: `操作成功！`,
                        type: 1
                    })
                   that.changeTOdo({isMyToDoList:0})
                }else{
                    showAlert({
                        msg: `操作失败：${data.info}`,
                        type: 0
                    })
                }
            })
            .catch((error)=>{
                this.$alert("查询失败，请检查网络！", {
                    confirmButtonText: "确定",
                    customClass: "alertFailure"
                })
            })
        },
        //点击通过方法
        handlePass(){
            // let signature = this.makeLoansForm.signature;
            // let _this=this;
            

            // if(signature){
            //     _this.$http.tblFinSrmApplyInfo({
            //         'id':_this.supplyChainFinance.role.ID,
            //         'isSigned':signature? 1:0
            //     }).then(res=>{
            //         if(res.data.code == 200){
            //             _this.$confirm('是否确认通过？').then(_ => {
            //                 _this.examinePass = 2
            //                 _this.makeLoansForm.backReason='';
            //                 _this.commonUpdate()
            //             })
            //             .catch(_ => {})
            //         }else{
            //             showAlert({
            //                 msg: `操作失败：${data.info}`,
            //                 type: 0
            //             })
            //         }
            //     }).catch((error)=>{
            //         _this.$alert("查询失败，请检查网络！", {
            //             confirmButtonText: "确定",
            //             customClass: "alertFailure"
            //         })
            //     });
                
            // }else{
            //     showAlert({
            //         msg: "请先确认签字",
            //         type: 2
            //     })
            // } 
            
            this.$confirm('是否确认通过？').then(_ => {
                    this.examinePass = 2
                    this.makeLoansForm.backReason='';
                    this.commonUpdate()
                })
                .catch(_ => {})

            

        },
        //退回方法
        sendBack(){
            let _this=this;
            if(this.makeLoansForm.signature){
                showAlert({
                    msg: "放款审批表已签字不允许退回",
                    type: 2
                })
                return
            }
            if(this.makeLoansForm.backReason==''){
                 showAlert({
                    msg: "请填写退回原因",
                    type: 2
                })
                return
            }
            this.$confirm('是否确认退回？').then(_ => {
                _this.examinePass = 3
                _this.makeLoansForm.backReason
                _this.commonUpdate()
            })
        },
        //点击返回
        backMyToList(){
            if(this.pageSourceCode == 'myProcessed'){
                this.changeMyProcessedCTCode('')
            }else{
                this.changeTOdo({isMyToDoList:0})
            }             
        } 
    },
    components:{
        // ReturnedMoney
    }
}
</script>


